<template>
    <div>
        <child />
    </div>
</template>

<script>
import Child from './Child.vue'
import { provide, reactive, ref, readonly } from 'vue'

export default {
    components: {
        Child
    },
    setup () {
        const location = ref('深圳')
        const geolocation = reactive({
            longitude: 90,
            latitude: 135
        })
        provide('location', readonly(location))
        provide('geolocation', readonly(geolocation))
        const updateLocation = () => {
            location.value = '中国江西'
        }
        provide('updateLocation', updateLocation)
        return {}
    }
}
</script>

<style lang="scss" scoped>

</style>